<template>
    <div style="height:100%;">
        <common :spaceType="spaceType" @getData="getData">
            <template slot="search">
                <div>
                    <tips></tips>
                </div>
            </template>
            <template slot="btn">
                <div>
                    <!-- $router.push('/parking_dnake_payment_record') -->
                    <el-button size="mini" class="btn" @click="showRecords = 1,spaceType=0" :type="showRecords == 1 && spaceType==0?'primary':''">进出记录</el-button>
                    <el-button size="mini" class="btn" @click="showRecords = 6,spaceType=0" :type="showRecords == 6 && spaceType==0?'primary':''">缴费记录</el-button>
                    <el-button size="mini" class="btn" @click="showRecords = 3,spaceType=0" :type="showRecords == 3 && spaceType==0?'primary':''">车场设备</el-button> 
                    <el-button size="mini" class="btn" @click="showRecords = 4,spaceType=0" :type="showRecords == 4 && spaceType==0?'primary':''">车场空位</el-button>
                    <el-button size="mini" class="btn" @click="showRecords = 5,spaceType=0" :type="showRecords == 5 && spaceType==0?'primary':''">报警日志</el-button>
                    <el-button size="mini" class="btn" @click="showRecords = 2,spaceType=0" :type="showRecords == 2 && spaceType==0?'primary':''">订单记录</el-button>
                </div>
            </template>
            <template v-if="spaceType == 0" slot="searchTips">
                <!-- <keep-alive> -->
                        <pkselect1  v-if="showRecords == 1"></pkselect1>
                        <pkselect2  v-if="showRecords == 2"></pkselect2>
                        <pkselect3  v-if="showRecords == 3"></pkselect3>
                        <pkselect4  v-if="showRecords == 5"></pkselect4>
                        <pkselect6  v-if="showRecords == 6"></pkselect6>
                <!-- </keep-alive> -->
            </template>
            <template slot="parkingdata" v-if="showRecords==6 || showRecords==5 || showRecords==4 || showRecords==3 || showRecords==2 || showRecords==1">
                <div>
                    <parkingLog v-show="showRecords==1"></parkingLog><!-- 进出记录 -->
                    <paymentRocords v-show="showRecords==2"></paymentRocords><!-- 订单记录 -->
                    <parkingDevice v-show="showRecords==3"></parkingDevice><!-- 设备 -->
                    <parkingSpace v-show="showRecords==4"></parkingSpace><!-- 停车场空位 -->
                    <parkingDevLog v-show="showRecords==5"></parkingDevLog><!-- 报警日志 -->
                    <parkingPay v-show="showRecords==6"></parkingPay><!-- 缴费日志 -->
                </div>
            </template>
        </common>
    </div>
</template>

<script>
import common from '../tiePoints/common_layout.vue';
import parkingLog from './parking_dnake_record.vue';
import parkingSpace from './parking_dnake.vue';
import tips from '../tiePoints/legend_tips.vue';
import paymentRocords from './parking_dnake_payment_record_hezi1.vue'
import parkingPay from './parking_pay.vue'
import parkingDevLog from './parking_dnake_devLoglist.vue'
import parkingDevice from './carDevs.vue'
import pkselect1 from './pkselect1.vue'
import pkselect2 from './pkselect2.vue'
import pkselect3 from './pkselect3.vue'
import pkselect4 from './pkselect4.vue'
import pkselect6 from './pkselect6.vue'
export default {
    data(){
        return {
            showRecords:1,
            spaceType:0
        }
    },
    components: {
        common,
        parkingLog,
        parkingSpace,
        tips,
        paymentRocords,
        parkingDevice,
        parkingDevLog,
        parkingPay,
        pkselect1,
        pkselect2,
        pkselect3,
        pkselect4,
        pkselect6,
    },
    methods:{
        getData(val){
            console.log(val);
            this.spaceType = val.spaceType
        }
    }
};
</script>

<style scoped>
</style>